.nextUsSection
    display: flex
    justify-content: center
    width: 100%

    margin-bottom: 160px

    &__section
        display: flex
        flex-direction: column
        align-items: center
        width: 100%

        padding: 80px 40px

        background-color: #474a51

        -webkit-box-shadow: 0px 0px 32px 10px rgba(71, 74, 81, 0.29)
        -moz-box-shadow: 0px 0px 32px 10px rgba(71, 74, 81, 0.29)
        box-shadow: 0px 0px 32px 10px rgba(71, 74, 81, 0.29)
        &_title
            margin-bottom: 30px
            &__text
                font-size: 60px
        &_places
            display: grid

            gap: 40px

            grid-template-columns: repeat(2, 1fr)
            grid-template-rows: repeat(2, 250px)
            &__place
                width: 100%
                height: 100%
                &_link
                    display: flex

                    flex-direction: column-reverse
                    align-items: center

                    width: 100%
                    height: 100%

                    padding: 10px

                    background-color: #ffffff
                    transition: background 0.3s ease
                    &:hover
                        background-color: #ffffff4d
                &_title
                    font-size: 20px
                    color: #282a2e
                &_position
                    position: relative
                    height: 90%
                    width: 100%

                    margin-bottom: 10px
                &_image
                    height: 100%
                    width: 100%

@media (max-width: 800px)
    .nextUsSection
        margin-bottom: 0px
        &__section
            padding: 30px 10px

            &_title
                margin-bottom: 20px
                &__text
                    font-size: 40px
            &_places
                gap: 40px
                grid-template-columns: 1fr
                grid-template-rows: repeat(4, 250px)
